<template>
	<div class="content">
		<div class="base">
			<Form inline class="fl">
				<Input type="text" placeholder="请输入个人ID" class="w200 m-r10" v-model="userID" />
				<Input type="text" placeholder="请输入用户名称" class="w200 m-r10" v-model="userName" />
				<Select placeholder="请选择状态" class="w200 m-r10" v-model="state">
					<Option value="0">全部</Option>
					<Option value="1">普通会员</Option>
					<Option value="2">广告主</Option>
				</Select>
				<DatePicker type="daterange" split-panels placeholder="请选择时间" class="w200 m-r10" format="yyyy-MM-dd HH:mm:ss" @on-change="getTime">
				</DatePicker>
				<Button type="primary" @click="query">查询</Button>
			</Form>
		</div>
		<!-- <fieldset>
			<legend>汇总</legend>
			<div>
				<table>
					<tbody>
						<tr>
							<td>BTC总数量:
								<span class="blue">10000.0000</span>
							</td>
							<td>ETH总数量:
								<span class="blue">10000.0000</span>
							</td>
							<td>USDT总数量:
								<span class="blue">10000.0000</span>
							</td>
							<td>EB总数量:
								<span class="blue">10000.0000</span>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</fieldset> -->
		<Button class="daochu" type="primary" size="large" @click="exportData">
            <Icon type="ios-download-outline"></Icon> 导出</Button>
		<Table stripe :columns="columns1" :data="list" ref="table"></Table>
		<Page :total="info" show-elevator :page-size="pageSize" show-total @on-change="changepage"></Page>

		<Modal v-model="modal2" title="Ta的节点" width='50%'>
			<Form :label-width="100">
				<div class="base p-b10 bor-b">
					<Form inline class="fl">
						<Input type="text" placeholder="请输入个人ID" class="w200 m-r10" v-model="jdId" />
						<DatePicker type="daterange" split-panels placeholder="请选择时间" class="w200 m-r10" format="yyyy-MM-dd HH:mm:ss" @on-change="getTime1">
						</DatePicker>
						<Select placeholder="请选择状态" class="w200 m-r10" v-model="state2">
							<Option value="0">全部</Option>
							<Option value="1">普通会员</Option>
							<Option value="2">广告主</Option>
						</Select>
						<Button type="primary" @click="jidian">查询</Button>
					</Form>
				</div>
				<Table height="400" class="m-t10" stripe :columns="columns2" :data="jdList"></Table>
			</Form>
		</Modal>

		<Modal v-model="modal3" title="Ta的上级" width='50%'>
			<Table height="200" class="m-t10" stripe :columns="columns9" :data='myUpList'></Table>
		</Modal>

		<Modal v-model="modal4" title="账户流水" width='40%'>
			<fieldset>
				<legend>账户信息</legend>
				<div>
					<table>
						<tbody>
							<tr>
								<td class="padding">积分总数量：
									<span class="blue">{{ adv }}</span>
								</td>
								<!--<td class="padding">USDT总数量：
									<span class="blue">{{ usdt }}</span>
								</td>-->
							</tr>
						</tbody>
					</table>
				</div>
				<!-- <Button class="daochu fr" type="primary" size="large" @click="exportData1">
                <Icon type="ios-download-outline"></Icon> 导出</Button> -->
			</fieldset>

			<Tabs type="card" class="m-t10">
				<TabPane label="发送明细">
					<Table height="400" stripe :columns="columns3" :data="sends" ref="table1"></Table>
				</TabPane>
				<TabPane label="认购明细">
					<Table height="400" stripe :columns="columns4" :data="orders" ref="table2"></Table>
				</TabPane>
				<!--<TabPane label="USDT明细">
					<Table height="400" stripe :columns="columns5" :data="usdtDetailVOS" ref="table2"></Table>
				</TabPane>-->
			</Tabs>
		</Modal>
		<Modal v-model="modal1" title="会员充值" width='40%'>
			<Form :label-width="100" :model="addForm" :rules="rules" ref="refuse">
				<FormItem label="充值会员ID" prop='title'>
					<Input class="w-50" v-model="addForm.userId" placeholder="请输入充值会员ID" :disabled="true" />
				</FormItem>
				<FormItem label="充值会员名称" prop='title'>
					<Input class="w-50" v-model="addForm.userName" placeholder="检索中..." :disabled="true" />
				</FormItem>
				<FormItem label="充值积分" prop='userNum'>
					<Input class="w-50" v-model="addForm.userNum" placeholder="请输入充值积分数量" />
				</FormItem>
				<FormItem label="备注" prop='userRem'>
					<Input class="w-50" v-model="addForm.userRem" placeholder="请输入备注" />
				</FormItem>
			</Form>
			<div slot="footer">
				<Button type="text" size="large" @click="closejj">取消</Button>
				<Button type="primary" size="large" @click="addjj">确定</Button>
			</div>
			<span class="red m-l10">*请认真检查充值会员信息和充值积分数量</span>
		</Modal>
		<Modal v-model="model" title="确认操作" :loading="loading" @on-ok="asyncOK" class="caozuo">
			<p>是否确定将该会员提升为[广告主]?</p>
		</Modal>
	</div>
</template>
<script>
	import moment from 'moment'
	export default {
		data() {
			return {
				modal1: false,
				addForm: {
					userId: '',
					userName: '',
					userNum: '',
					userRem: '',
				},
				rules: {
					userNum: [{
						required: true,
						message: '充值积分数量不能为空',
						trigger: 'blur'
					},{
						type: 'string',
						pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,9})?$/,
						message:'请输入合法的充值积分数量',
						trigger:'blur'
					}],
					userRem: [{
						required: true,
						message: '备注不能为空',
						trigger: 'blur'
					}]
				},
				state: '0', // 状态
				state2: '0', // 状态
				model: false,
				loading: true,
				modelIndex: '',
				userID: '',
				userName: '',
				list: [], // 会员列表
				zcList: [], // 资产列表
				jdList: [], // 节点列表
				sends: [], // 发送明细
				orders: [], // 认购明细
				myUpList: [], // 上级的信息
				adv: '',
				usdt: '',
				usdtDetailVOS: [], //USDT明细
				huiyId: '',
				info: null, // 总条数
				pageSize: 20, // 一页显示多少条
				page: 1, // 页数
				jdId: '',
				tjId: '',
				paiid: '',
				tjName: '',
				dataValue: [], // 时间段值 会员列表
				dataValue1: [], // 时间段值  节点
				modal2: false,
				modal3: false,
				modal4: false,
				columns1: [{
						title: '个人ID',
						key: 'uuid',
						align: 'center',
						render: (h, params) => {
							return h(
								'div', {
									style: {
										cursor: 'pointer',
										color: '#2db7f5'
									},
									on: {
										click: () => {
											this.getUuid(this.list[params.index].uuid)
										}
									}
								},
								params.row.uuid
							)
						}
					},
					//					{
					//						title: '上级ID',
					//						key: 'puuid',
					//						align: 'center',
					//					},
					{
						title: '用户名称',
						align: 'center',
						key: 'nickName',
					},
					{
						title: '手机号码',
						align: 'center',
						key: 'phone',
						render: (h, params) => {
							return h('div', params.row.phone == null ? '#' : params.row.phone)
						}
					},
					{
						title: '账户积分',
						align: 'center',
						key: 'adv',
					},
					//					{
					//						title: '个人业绩',
					//						align: 'center',
					//						key: 'income',
					//						render: (h, params) => {
					//							return h('div', params.row.income == null ? '0' : params.row.income)
					//						}
					//					},
					{
						title: '会员类型',
						align: 'center',
						key: 'typeId',
						render: (h, params) => {
							if(params.row.typeId == 1) {
								return h('div', '普通会员');
							} else if(params.row.typeId == 2) {
								return h('div', '广告主')
							}
						}
					},
					{
						title: 'Ta的节点',
						align: 'center',
						key: 'taNode',
						render: (h, params) => {
							return h(
								'div', {
									style: {
										cursor: 'pointer',
										color: '#2db7f5'
									},
									on: {
										click: () => {
											this.zhitui(this.list[params.index].uuid)
										}
									}
								},
								params.row.taNode
							)
						}
					}, {
						title: '注册时间',
						align: 'center',
						key: 'createTime',
						width: 200,
						sortable: true
					}, {
						title: '账号状态',
						align: 'center',
						key: 'statusId',
						width: 200,
						render: (h, params) => {
							if(this.list[params.index].statusId == 1) {
								if(this.list[params.index].typeId == 1) { // 如果是普通会员
									return h('div', [
										h(
											'Button', {
												props: {
													type: 'error',
													size: 'small'
												},
												style: {
													marginRight: '5px'
												},
												on: {
													click: () => {
														this.zhuangtai(this.list[params.index].id, this.list[params.index].statusId)
													}
												}
											},
											'冻结'
										),
										h(
											'Button', {
												props: {
													type: 'primary',
													size: 'small'
												},
												style: {
													marginRight: '5px'
												},
												on: {
													click: () => {
														this.shenji(this.list[params.index].id)
													}
												}
											},
											'升级'
										)
									])
								} else if(this.list[params.index].typeId == 2) { // 如果是广告主
									return h('div', [
										h(
											'Button', {
												props: {
													type: 'error',
													size: 'small'
												},
												style: {
													marginRight: '5px'
												},
												on: {
													click: () => {
														this.zhuangtai(this.list[params.index].id, this.list[params.index].statusId)
													}
												}
											},
											'冻结'
										),
										h(
											'Button', {
												props: {
													type: 'primary',
													size: 'small',
													disabled: true
												},
												style: {
													marginRight: '5px'
												}
											},
											'升级'
										)
									])
								}
							} else {
								return h('div', [
									h(
										'Button', {
											props: {
												type: 'primary',
												size: 'small'
											},
											style: {
												marginRight: '5px'
											},
											on: {
												click: () => {
													this.zhuangtai(this.list[params.index].id, this.list[params.index].statusId)
												}
											}
										},
										'解冻'
									),
									h(
										'Button', {
											props: {
												type: 'primary',
												size: 'small',
												disabled: true
											},
											style: {
												marginRight: '5px'
											}
										},
										'升级'
									)
								])
							}
						}
					}, {
						title: '操作',
						key: 'action',
						width: 250,
						fixed: 'right',
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h(
									'Button', {
										props: {
											type: 'primary',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.getCc(this.list[params.index].uuid, this.list[params.index].nickName)
											}
										}
									},
									'充值'
								),
								h(
									'Button', {
										props: {
											type: 'primary',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.liushui(this.list[params.index].id)
											}
										}
									},
									'账户流水'
								), h(
									'Button', {
										props: {
											type: 'primary',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.chongzhi(this.list[params.index].id)
											}
										}
									},
									'重置交易密码'
								)
							])
						}
					}
				],
				columns2: [{
						title: '个人ID',
						align: 'center',
						key: 'uuid'
					}, {
						title: '名称',
						align: 'center',
						key: 'nickName'
					},
					{
						title: '手机号码',
						align: 'center',
						key: 'phone',
						render: (h, params) => {
							return h('div', params.row.phone == null ? '#' : params.row.phone)
						}
					},
					{
						title: '会员类型',
						align: 'center',
						key: 'typeId',
						render: (h, params) => {
							if(params.row.typeId == 1) {
								return h('div', '普通会员');
							} else if(params.row.typeId == 2) {
								return h('div', '广告主')
							}
						}
					},
					{
						title: '注册时间',
						align: 'center',
						key: 'createTime',
						sortable: true
					}
				],
				columns3: [{
					title: '时间',
					align: 'center',
					key: 'createTime',
					sortable: true
				}, {
					title: '数量',
					align: 'center',
					key: 'num'
				}, {
					title: '操作',
					align: 'center',
					key: '',
					render: (h, params) => {
						if(this.sends[params.index].statusId == 1) {
							return h('div', '转入')
						} else {
							return h('div', '转出')
						}
					}
				}],
				columns4: [{
					title: '时间',
					align: 'center',
					key: 'createTime',
					sortable: true
				}, {
					title: '单号',
					align: 'center',
					key: 'orderNum'
				}, {
					title: '数量',
					align: 'center',
					key: 'num',
				}, {
					title: '金额',
					align: 'center',
					key: 'totalPrice'
				}],
				columns5: [{
					title: '时间',
					align: 'center',
					key: 'createTime',
					sortable: true
				}, {
					title: '数量',
					align: 'center',
					key: 'num',

				}, {
					title: '操作',
					align: 'center',
					key: '',
					render: (h, params) => {
						return h('div', '提币')
					}
				}],
				columns9: [{
						title: '个人ID',
						align: 'center',
						key: 'uuid'
					}, {
						title: '名称',
						align: 'center',
						key: 'nickName'
					},
					{
						title: '手机号码',
						align: 'center',
						key: 'phone',
						render: (h, params) => {
							return h('div', params.row.phone == null ? '#' : params.row.phone)
						}
					},
					{
						title: '会员类型',
						align: 'center',
						key: 'typeId',
						render: (h, params) => {
							if(params.row.typeId == 1) {
								return h('div', '普通会员');
							} else if(params.row.typeId == 2) {
								return h('div', '广告主')
							}
						}
					},
					{
						title: '注册时间',
						align: 'center',
						key: 'createTime',
						sortable: true
					}
				]
			}
		},
		methods: {
			getUuid(id) { // 点击用户,查询上级的信息
				let token = localStorage.getItem('mytoken')
				this.modal3 = true;
				this.axios.get('account/member/superior/' + id, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.myUpList = res.data.data.pMemberVo;
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message);
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message);
						localStorage.removeItem('mytoken');
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// 节点
			zhitui(id) {
				let token = localStorage.getItem('mytoken')
				this.modal2 = true;
				this.paiid = id;
				let params = this.qs.stringify({
					pUuid: id
				})
				this.axios.post('account/member/myNode', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.jdList = res.data.data.allChildNodeMember;
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message);
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message);
						localStorage.removeItem('mytoken');
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			jidian() {
				let spy2;
				let token = localStorage.getItem('mytoken')
				if(this.state2 == 0) {
					spy2 = '';
				} else {
					spy2 = this.state2;
				}
				let params = this.qs.stringify({
					pUuid: this.paiid,
					uuid: this.jdId,
					typeId: spy2,
					startTime: this.dataValue1[0] == '' ? '2000-12-30 00:00:00' : this.dataValue1[0],
					endTime: this.dataValue1[1] == '' ? '2200-12-30 00:00:00' : this.dataValue1[1]
				})
				this.axios.post('account/member/myNode', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.jdList = res.data.data.allChildNodeMember
						this.$Message.info(res.data.message)
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message)
						this.jdList = []
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// 冻结解冻账号
			zhuangtai(id, statusId) {
				let token = localStorage.getItem('mytoken')
				let params = this.qs.stringify({
					memberId: id,
					statusId: statusId
				})
				this.axios.put('account/member/freezing', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.$Message.info(res.data.message)
						this.getList()
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message)
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// // 查看流水
			liushui(id) {
				this.modal4 = true
				this.huiyId = id
				this.getUser()
			},
			// 重置密码
			chongzhi(id) {
				let token = localStorage.getItem('mytoken')
				let params = this.qs.stringify({
					memberId: id
				})
				this.axios.put('account/member/resetTradePassword', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.$Message.info(res.data.message)
						this.getList()
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message)
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// 获取账户流水
			getUser() {
				let token = localStorage.getItem('mytoken')
				this.axios
					.get('account/member/flowRecord/' + this.huiyId, {
						headers: {
							Authorization: 'bearer ' + token
						}
					})
					.then(res => {
						if(res.data.code == 8008) {
							this.adv = res.data.data.adv
							this.usdt = res.data.data.usdt
							this.usdtDetailVOS = res.data.data.usdtDetailVOS
							this.sends = res.data.data.sends
							this.orders = res.data.data.orders
						} else if(res.data.code == 4004) {
							this.$Message.info(res.data.message)
						} else if(res.data.code == 5501) {
							this.$Message.info(res.data.message)
							localStorage.removeItem('mytoken')
							this.$router.push({
								name: 'login'
							})
						}
					})
			},
			// 导出
			exportData() {
				this.$refs.table.exportCsv({
					filename: '会员列表'
				})
			},
			exportData1() {
				this.$refs.table1.exportCsv({
					filename: '量化宝明细'
				})
				this.$refs.table2.exportCsv({
					filename: '稳健基金明细'
				})
			},
			// // 处理时间段时间格式
			getTime(daterange) {
				this.dataValue = daterange
				// this.startTime1 = this.dataValue[0].slice(0, 10);
				// this.endTime1 = this.dataValue[1].slice(0, 10);
			},
			getTime1(daterange) {
				this.dataValue1 = daterange
			},
			// // 获取所有会员列表
			getList() {
				let token = localStorage.getItem('mytoken')
				let params = this.qs.stringify({
					pn: this.page,
					pageSize: this.pageSize
				})
				this.axios.post('account/platform/member/all', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.list = res.data.data.adminDTOList
						this.zcList = res.data.data.coinSumDTO
						this.info = res.data.data.total
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// // 查询
			query() {
				let spy;
				let token = localStorage.getItem('mytoken')
				// if(this.dataValue[0] == '' ) {
				//     this.getList();
				//     return
				//   }
				if((this.dataValue == undefined || this.dataValue[0] == '' || this.dataValue.length == 0) && this.userID == '' && this.userName == '' && this.state == '') {
					this.pageSize = 20
					this.getList()
					return
				}
				if(this.state == 0) {
					spy = '';
				} else {
					spy = this.state;
				}
				this.pageSize = 100
				let params = this.qs.stringify({
					pn: this.page,
					pageSize: this.pageSize,
					typeId: spy,
					uuid: this.userID,
					nickName: this.userName,
					startTime: this.dataValue[0] == '' ? '2000-12-30 00:00:00' : this.dataValue[0],
					endTime: this.dataValue[1] == '' ? '2200-12-30 00:00:00' : this.dataValue[1]
				})
				this.axios.post('account/platform/member/all', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.list = res.data.data.adminDTOList
						this.info = this.list.length
					} else if(res.data.code == 4004) {
						this.$Message.info(res.data.message)
						this.list = []
						this.info = this.list.length
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			// 分页
			changepage(page) {
				this.page = page
				let token = localStorage.getItem('mytoken')
				let params = this.qs.stringify({
					pn: page,
					pageSize: this.pageSize
				})
				this.axios.post('account/platform/member/all', params, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.list = res.data.data.adminDTOList
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						localStorage.removeItem('mytoken')
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			shenji(id) { // 弹出升级提示
				this.model = true;
				this.modelIndex = id;
			},
			asyncOK() { // 升级成功
				let token = localStorage.getItem('mytoken');
				this.axios.get('account/member/upgrade/' + this.modelIndex, {
					headers: {
						Authorization: 'bearer ' + token
					}
				}).then(res => {
					if(res.data.code == 8008) {
						this.model = false;
						this.$Message.info(res.data.message);
						this.getList();
					} else if(res.data.code == 5501) {
						this.$Message.info(res.data.message)
						this.$router.push({
							name: 'login'
						})
					}
				})
			},
			getCc(uuid, nickName) {
				this.$refs["refuse"].resetFields(); // 重置表单
				this.modal1 = true;
				this.addForm.userId = uuid;
				this.addForm.userName = nickName;
			},
			addjj() { // ok添加
				this.$refs.refuse.validate((valid) => { // 表单验证
					if(valid) {
						let token = localStorage.getItem('mytoken');
						let params = this.qs.stringify({
							uuid: this.addForm.userId,
							num: this.addForm.userNum,
							remake: this.addForm.userRem
						})
						this.axios.post('account/Recharge', params, {
							headers: {
								Authorization: 'bearer ' + token
							}
						}).then(res => {
							if(res.data.code == 8008) {
								this.$Message.info(res.data.message);
								this.getList();
								this.modal1 = false;
							} else if(res.data.code == 5501) {
								this.$Message.info(res.data.message)
								this.$router.push({
									name: 'login'
								})
							} else {
								this.$Message.info(res.data.message);
							}
						})
					}
				})
			},
			closejj() {
				this.modal1 = false;
			}
		},
		created() {
			this.getList()
		},
		mounted() {
			this.$Message.config({
				top: 250
			})
		}
	}
</script>
<style lang="less">
	.caozuo {
		.ivu-modal-wrap {
			.ivu-modal {
				.ivu-modal-content {
					.ivu-modal-footer {
						padding: 12px 18px 12px 18px;
						.ivu-btn-text {
							float: left;
							padding-left: 70%;
						}
					}
				}
			}
		}
	}
</style>